<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>{:cache('web_name')}</title>
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/swiper.min.css">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mui.css?v=1">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mobileSelect.css" />
		<link rel="stylesheet" href="__API__/lib/css/style.css">
		<script type="text/javascript" src="__API__/lib/js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/mui.js"></script>
		<script src="__API__/lib/js/mobileSelect.js" type="text/javascript" charset="utf-8"></script>
		<script src="__API__/lib/js/city.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="__API__/lib/js/swiper.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/vue.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/common.js"></script>
		<script type="text/javascript" src="__API__/lib/js/index.js"></script>

	<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script></head>

	<body>
		<div class="home_page" id="app">
			<div class="search_box">
				<div class="collect" @click="guanzhu()">
					<img src="__API__/lib/images/guanzhu.png" alt="">
					<span>关注</span>
				</div>
				<div class="search_input" @click="goDetail('api/index/search.html')">
					<i class="searchicon"><img src="__API__/lib/images/h_search.png" /></i>
					<input type="text" name="" id="" value="" placeholder="舒缓修复精华" disabled />
				</div>
			</div>
			<div class="sht"></div>
			<div class="main">
				<!--banner-->
				<div class="banner">
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<div class="swiper-slide" v-for="(item,i) in swiperList" :key="i">
								
								<img :src="item.single_pic" @click="goDetail(item.path)" />
							</div>
						</div>
						<div class="swiper-pagination"></div>
					</div>
				</div>
				<div class="menu">
					<ul class="menu_ul">
						<li @click="goDetail('{:url(\'classification\')}')">
							<i><img src="__API__/lib/images/icon1.png" /></i>
							<div class="txt">
								<h2>快速选购</h2>
								<p>发现健康生活</p>
							</div>
						</li>
						
						<li @click="goDetail('{:url(\'commission2\')}')">
							<i><img src="__API__/lib/images/icon2.png" /></i>
							<div class="txt">
								<h2>购物积分</h2>
								<p>买的多积分越多</p>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<div class="home_box bg_color">
				<h2>尊客专享</h2>
				<ul class="goods_list">
					<li v-for="(item,i) in goodsList" :key="i" @click="goDetail('{:url(\'goods_detail\')}?id=' + item.id)">
						<div class="img"><img :src="item.single_pic" alt=""></div>
						<div class="info">
							<div class="price">
								<span class="new_price">￥<em>{{item.price_0}}</em></span>
								<span class="old_price">￥{{item.price_4}}</span>
							</div>
							<h3>{{item.title}}</h3>
<!--							<div class="cart_icon"><img src="__API__/lib/images/h_car.png" alt=""></div>-->
						</div>
					</li>
				</ul>
			</div>
			<!--footer-->
			<div class="fb"></div>

			<div class="footer">
				<div class="li" v-for="(item,i) in navList" :key="i">
					<span @click="goDetail(item.path)">
						<img :src="pageIndex == i ? item.selecticonPath : item.iconPath">
					</span>
					<p :class="{'blue':pageIndex == i}">{{item.title}}</p>
				</div>
			</div>
		</div>
		<script>
			// 判断是否是微信浏览器
			function is_weixin(){
				var ua = navigator.userAgent.toLowerCase();
				if(ua.match(/MicroMessenger/i)=="micromessenger") {
					return true;
				} else {
					return false;
				}
			}
			var invite_code = "{:input('invite_code')}";
			if(invite_code){
				localStorage.setItem('invite_code',invite_code);
			}
			var token = localStorage.getItem('token');
			var openid = localStorage.getItem('openid');

			if(token && !openid){
				if(is_weixin()){
					common.ajax("{:url('Wechat/mobile_login')}",{token:token} , function(res){
						window.location.href = res.data
					})
				}
			}
			var app = null;
			app = new Vue({
				el: '#app',
				data: {
					pageIndex: 0,
					navList: [{
							path: "{:url('index')}",
							iconPath: '__API__/lib/images/nav1.png',
							selecticonPath: '__API__/lib/images/nav1_on.png',
							title: '首页'
						},
						{
							path: "{:url('classification')}",
							iconPath: '__API__/lib/images/nav2.png',
							selecticonPath: '__API__/lib/images/nav2_on.png',
							title: '全部'
						},
						{
							path: "{:url('cart')}",
							iconPath: '__API__/lib/images/nav3.png',
							selecticonPath: '__API__/lib/images/nav3_on.png',
							title: '购物车'
						},
						{
							path: "{:url('my')}",
							iconPath: '__API__/lib/images/nav4.png',
							selecticonPath: '__API__/lib/images/nav4_on.png',
							title: '我的'
						}
					],
					swiperList: {$banner|raw}
					,
					goodsList: [

					]
				},
			created: function() {
					let that=this
				common.ajax("{:url('Goods/home')}",{token:localStorage.getItem('token')} , function(res){
					that.goodsList =res.data
				})
				// axios
				// 		.get('{:url("Goods/all")}')
				// 		.then(res=>{
				// 			this.goodsList =res.data.data
				// 		})


			},
				methods: {
					guanzhu(){
						window.location.href = "https://mp.weixin.qq.com/s?__biz=MzkyODUxNDQ3OA==&mid=2247483653&idx=1&sn=0b8948d3cdf245ea22600df1bca771cd&chksm=c216e9c4f56160d2b6be84062424573dc27597219acee38d58443db2d5087ede0c76cd144d21#rd";
					},
					goDetail(url) {

						common.openUrl(url)
					}
				},
			});
		</script>
	</body>

</html>
